<template>
  <div>
    <!-- 2. 利用差值表达式{{}}显示变量 -->
    <!-- {{表达式或变量}} -->
    <div>{{a}}</div>
    <p>{{obj.name}}--- {{obj.age}}</p>
    <span>{{obj.age > 18 ? '成人了': '小屁孩'}}</span>
    <p>{{1+1}}</p>
    <ul>
      <li>1</li>
      <li>2</li>
      <li>3</li>
      <li>4</li>
      <li>5</li>
    </ul>
  </div>
</template>

<script>
// 是vue项目的入口文件
export default {
  // vue组件的变量都定义在data函数return的对象里
  // data是一个函数 
  // 1.定义变量
 data() {
  //  注意: 要返回一个对象
   return {
      a: '鲁班七号',
      obj: {
        name: '李卫东',
        age: 20
      }
   }
 }
}
</script>

<style>

</style>